<template>
    <div>
        <div class="conter">
            <div class="box">
            <van-image
            round
            width="5rem"
            height="5rem"
            :src="user.headPortrait"
         />
         <div>
             <h3>{{user.nickname}}</h3>
             <span>个性签名</span>
         </div>
         <van-icon name="arrow"  class="tb"/>
        </div> 
        <div class="geren">
            <span>关注：0</span>
            <span>粉丝：0</span>
            <button @click="$router.push('/updata')">编辑资料</button>
            <button class="xk">设置</button>
        </div>
        </div>
     
<van-tabs animated @click="publish">
  <van-tab title="我的收藏">
     <page-dish :val='pub'></page-dish>
  </van-tab>
  <van-tab title="我的发布" >
      <page-dish :val='pub'></page-dish>
  </van-tab>
</van-tabs>


    </div>
</template>

<script>
import PageDish from '@/components/PageDish.vue'
import {mapState} from 'vuex'
    export default {
  components: { PageDish },
    computed: {
        ...mapState(['user'])
    },
    data() {
        return {
           pub:''
        }
    },
    methods: {
        //我的发布
        publish(a,b){
             if(b == '我的发布'){
            let url = '/user/publish/'+ JSON.parse(sessionStorage.getItem('user')).id
            this.axios.get(url).then((res) => {
                console.log(res.data.data)
                this.pub = res.data.data
            } )
            }else if(b == '我的收藏'){
                let url = '/user/myCollect/' + JSON.parse(sessionStorage.getItem('user')).id
                this.axios.get(url).then((res) => {
                    this.pub = res.data.data
                })
            }
        },
        //关注列表
        follow(){
            let url = '/user/queryFollowList/' + JSON.parse(sessionStorage.getItem('user')).id
            this.axios.get(url).then(result => {
                console.log(result)
            })
        }
    
    },
   mounted () {
    this.follow()
      let url = '/user/myCollect/' + JSON.parse(sessionStorage.getItem('user')).id
                this.axios.get(url).then((res) => {
                    this.pub = res.data.data
                })
        },
        
    }
</script>

<style lang="scss" scoped>
.conter{
    margin-top: 10vw;
    height: 50vw;
    border-bottom: 1px solid #ccc;
}
  .box{
      margin: 2em 2em 1em 2em;
      display: inline-flex;
   
      h3{
          margin: 0.5em 0 0.5em 1em;
      }
      span{
          margin: 0 0 0.5em 1em;
          color: #ccc;
      }
      .tb{
          margin-top: 4vw;
          margin-right: 0;
          
      }

 }
.geren{
    margin-bottom: 0vw;
    margin-left: 6vw;
    span{
        margin-right: 6vw;
    }
    button{
        margin-right: 6vw;
        border: 0;
        padding: 5px 10px;
        border-radius: 10px;
}
}
</style>